<template>
  <div>
    <p>{{ age1 }}</p>
    <p>{{ abc }}</p>
    <button @click="updateAge(1)">修改数据</button>
    <button @click="updateAgeAfter1s(3)">1s后修改数据</button>
  </div>
</template>

<script>
import { mapState, mapMutations, mapActions, mapGetters } from 'vuex'
export default {
  computed: {
    // ...mapState (['age','uname','sex']),数组写法可以调用多个，如果不改名字方便
    ...mapState({ age1: 'age' /* 新的名字：'仓库的数据名' */ }), //对象写法，改名字用对象
    ...mapGetters({ abc: 'abc' })
  },
  methods: {
    // ...mapMutations({updateAge: 'updateAge'}),
    ...mapMutations(['updateAge']),
    ...mapActions(['updateAgeAfter1s'])
  }
}
</script>

<style scoped>
div {
  background-color: #fe7299;
}
</style>
